import React,{ useEffect } from 'react'
import { View,Text,Image,Button } from '@tarojs/components'
import './index.less'
import Taro,{ useDidShow } from '@tarojs/taro';
import { Store } from '@/store/core.store';
import UserStore from '@/store/user.store';
const baseCls = `legions-deploy-detail`;
import dayjs from 'dayjs'
import { routers } from '@/router';
import get from 'lodash/get';
import DeployStore from '@/store/deploy.store';
import { deployService } from '@/api/deploy.service';
export default function DeployDetail() {
    const user_store = Store.getStore(UserStore)
    const store = Store.getStore(DeployStore)
    useDidShow(() => {
        user_store.authentication();
    })
    useEffect(() => {
        return () => {
            store.setDetail(null);
        }
    },[])
    const onGotoGitlabUrl = (type:'jobs'|'pipelines') => {
        const _repository_url = store.detail?.repository_https as string;
        let id = 'jobs_id';
        if (type === 'pipelines') {
            id = 'pipeline_id';
        }
        const url = `${_repository_url.replace('.git','')}/-/${type}/${get(store.detail,id)}`
        if (Taro.getEnv() === Taro.ENV_TYPE.WEAPP) {
            Taro.navigateTo({
                url: `${routers.merge_requests}?url=${url}`
            })
        }
        if (Taro.getEnv() === Taro.ENV_TYPE.WEB) {
            window.open(url)
        }
    }
    const onApproved = () => {
        if (store.isDisabledApproved) {
            return;
        }
        Taro.showModal({
            title: '同意',
            content: '发布申请审批通过',
            success: async function (res) {
                if (res.confirm) {
                    const result = await deployService.run(store.detail?._id as string)
                    if (get(result,'success')) {
                        Taro.showToast({
                            title: get(result,'message'),
                            icon: 'success',
                            duration: 2000,
                        })
                        Taro.navigateTo({
                            url: routers.deploy
                        })
                    } else {
                        Taro.showToast({
                            title: get(result,'message'),
                            icon: 'error',
                            duration: 2000,
                        })
                    }
                }
            }
        })
    }
    return (
        <View className={baseCls}>
            <View className='panel__content'>
                <View className='title'>开发审批信息</View>
                <View className='content'>
                    <Text className='title'>
                        发布标题：{store.detail?.release_title}
                    </Text>
                    <Text className='title desc'>
                        发布内容：{store.detail?.release_content}
                    </Text>
                    <Text className='li'>
                        项目名称：{store.detail?.repository_name}
                    </Text>
                    <Text className='li'>
                        来源分支：{store.detail?.source_branch}
                    </Text>
                    <Text className='li'>
                        申请时间：{dayjs(store.detail?.create_time).format('YYYY-MM-DD HH:mm:ss')}
                    </Text>
                    <Text className='li'>
                        处理时间：{store.detail?.developer_assign_status === '1' ? dayjs(store.detail?.developer_assign_date).format('YYYY-MM-DD HH:mm:ss') : '--'}
                    </Text>
                </View>
                <View className='title'>运维审批</View>
                <View className='content'>
                    <View className='li'>
                        <View className='name'>
                            <Text className='text'>{store.detail?.developer_assign_members}</Text>
                        </View>
                        <View className='direction'><Image className='image' src='https://hoolinks-frontend-resources.oss-cn-shenzhen.aliyuncs.com/images/weapp-to.png'></Image></View>
                        <View className='name'>
                            <Text className='text'>{store.detail?.devops_assign_members}</Text>
                        </View>
                    </View>
                    <Text className='li'>
                        处理时间：{store.detail?.devops_assign_status === '1' ? dayjs(store.detail?.devops_assign_date).format('YYYY-MM-DD HH:mm:ss') : '--'}
                    </Text>

                </View>
                <View className='title'>部署进度</View>
                <View className='content'>
                    <View className='li'>
                        <View className='name'>
                            <Text className='text'>{store.detail?.devops_assign_members}</Text>
                        </View>
                    </View>
                    <Text className='li'>
                        处理时间：{store.detail?.deploy_status === '1' ? dayjs(store.detail?.deploy_date).format('YYYY-MM-DD HH:mm:ss') : '--'}
                    </Text>

                </View>

            </View>
            <View className='bottom'>
            <Button className='button disabled' disabled={store.isDisabledDelete} style={{ color: '#FF2A2A',border: '1px solid #FF2A2A' }} >删除</Button>
                <Button className='button' style={{ color: '#108DE9',border: '1px solid #0E8FE9' }} onClick={onGotoGitlabUrl.bind(this,'jobs')}>任务</Button>
                <Button className='button' style={{ color: '#108DE9',border: '1px solid #0E8FE9' }} onClick={onGotoGitlabUrl.bind(this,'pipelines')}>流水</Button>
                <Button className={`button ${store.isDisabledApproved ? 'disabled' : ''}`} disabled={store.isDisabledApproved} style={{ color: '#FFFFFF',background: '#0E8FE9' }} onClick={onApproved}>通过</Button>
            </View>
        </View>
    )
}
